<template>
    <div class="item">
        <div class="header">
            <img
                    v-lazy="user.avatar"
            />
        </div>
        <p class="nickname">
            {{user.nickname}}
        </p>
        <p class="status" v-if="status === '2'">审核中</p>
    </div>
</template>

<script>
export default {
    name: "item",
    props: {
        // 用户信息
        user: {
            type: Object
        },
        status: {
            type: String
        }
    }
}
</script>

<style scoped lang="less">
    @import "@/theme.less";
    .item{
        position: relative;
        width: 80px;
        height: 110px;
        float: left;
        background: #fff;
        margin: 10px 0 5px 11px;
        div.header{
            width: 80px;
            height: 80px;
            img{
                width: 100%;
                height: 100%;
            }
        }
        p.nickname{
            width: 100%;
            height: 30px;
            padding:0 5px;
            box-sizing: border-box;
            line-height: 30px;
            text-align: center;
            font-size: @font-min;
            color: @font-color1;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
        p.status{
            position: absolute;
            top:0;
            left:0;
            width: 50px;
            height: 20px;
            line-height: 20px;
            text-align: center;
            color: #fff;
            background: @assist-color1;
        }
    }
</style>
